<template>
	<view>
		<view class="list" v-if="insList.length>0">
			<view class="cell" v-for="(item, index) in insList" @click="onCLickCell(item)">
				<view class="icon"></view>
				<view class="text">{{item.title}}</view>
			</view>
		</view>
		<view class="" v-else>
			<u-empty mode="car" :marginTop="50" text="暂无数据" icon="/static/images/common/empty.png"></u-empty>
		</view>
	</view>

</template>

<script>
	import {
		getInsList
	} from "@/api/user.js"
	export default {
		data() {
			return {
				total: 0,
				pagination: {
					pageSize: 20, // 步长
					pageNum: 1, // 页码
				},
				isloading: false,
				insList: [] //数组
			};
		},
		onLoad() {
			let _this = this;
			_this.getinstructions();
		},
		onPullDownRefresh() {
			// 1. 重置关键数据
			this.pagination.pageNum = 1
			this.total = 0
			this.isloading = false
			this.insList = []

			this.getinstructions()
		},
		onReachBottom() {
			if (this.pagination.pageNum * this.pagination.pageSize >= this.total) return uni.$showMsg('数据加载完毕!')

			if (this.isloading) return

			// 让页码值自增+1
			this.pagination.pageNum++
			this.getinstructions()

		},
		methods: {
			onCLickCell(item) {

				uni.navigateTo({
					url: '/pages-sub/FAQ/FAQDetails?FAQid=' + item.id
				})
			},
			formatArray(arr) {
				return arr.map(item => {
					const date = new Date(item.updateTime);
					const timeFormat = uni.$u.timeFormat;
					let timeValue = timeFormat(date, 'yyyy-mm-dd hh:mm:ss');

					return {
						id: item.id,
						title: item.title,
						content: item.content,
						date: timeValue,
					}
				})
			},
			getinstructions() {
				const data = {
					"pageSize": this.pagination.pageSize,
					"pageNum": this.pagination.pageNum,
					"orderByColumn": "",
					"isAsc": "",
				};
				getInsList(data).then(res => {
					this.pagination.pageNum++;
					this.total = res.data.total
					this.insList = this.insList.concat(this.formatArray(res.data.rows))
					console.log("this.insList: " + JSON.stringify(this.insList));
					uni.stopPullDownRefresh()
				}).catch(err => {
					uni.stopPullDownRefresh()
				})
			}

		}
	};
</script>

<style lang="scss">
	page {
		background-color: #F5F6FA;
	}

	.list {

		background-color: #F5F6FA;

		.cell {
			margin: 20rpx 0rpx;
			display: flex;
			align-items: center;
			width: 100%;
			height: 112rpx;
			background: #ffffff;

			.icon {
				width: 30rpx;
				height: 30rpx;
			}

			.text {

				font-size: 32rpx;
				font-family: PingFangSC, PingFang SC;
				font-weight: 500;
				color: #3A3D4B;
				line-height: 32rpx;
			}
		}
	}
</style>